<template>
    <div
        class="w-full px-18px py-10px my-5px rounded-1 box-border cursor-pointer hover:bg-#e5e5e5 hover:color-#fafafa"
        :class="{ 'bg-#e5e5e5 color-#000000 font-bold': current }"
        @click="
            () => {
                emits('click-item', entry!);
            }
        "
    >
        <n-ellipsis class="w-100px">
            {{ entry?.title || "" }}
        </n-ellipsis>
    </div>
</template>

<script lang="ts" setup>
import { Entry } from "@/types/intro";

const props = defineProps<{
    entry?: Entry;
    current: boolean;
}>();

const emits = defineEmits<{
    (e: "click-item", category: Entry): void;
}>();
</script>

<style scoped></style>
